<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>后台管理</title>
<link href="__PUBLIC__/ht/css/main.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="__PUBLIC__/ht/js/jquery1.8.js"></script>
<script type="text/javascript" src="__PUBLIC__/ht/js/action.js"></script>
<script src="__PUBLIC__/ht/js/jquery.flot.js"></script>
<link href="__PUBLIC__/ht/css/order.css" rel="stylesheet" type="text/css" />
<!--[if IE]>
<script src="__PUBLIC__/ht/js/excanvas.min.js"></script>
<![endif]-->
</head>
<body>

<div class="aaa_pts_show_1">【 <font style="color:#090;"><?php echo $shop_name; ?></font> 商品销售统计 】</div>


<div class="aaa_pts_show_2">
    
    <div>
       <div class="aaa_pts_4">销售数据趋势</div>
    </div>
    <div class="aaa_pts_3">
        
       <ul class="tongji_1">
          <li class="aaa_pts_4 <?php echo $type!='m' ? 'r1' : NULL; ?>" onclick="location='{:U('order_count')}?shop_id=<?php echo $shop_id ?>&type=d'">日视图</li>
          <li class="aaa_pts_4 <?php echo $type=='m' ? 'r1' : NULL; ?>"  onclick="location='{:U('order_count')}?shop_id=<?php echo $shop_id ?>&type=m'">月视图</li>
       </ul>
    
       <div id="tongji" style="width:100%; height:250px; overflow:visible;"></div>
    </div>
    
</div>

<div class="aaa_pts_show_2">
    <div>
       <div class="aaa_pts_4">最近订单</div>
       <div class="aaa_pts_4"><a href="{:U('index')}?shop_id=<?php echo $shop_id ?>">全部订单</a></div>
    </div>
    <div class="aaa_pts_3">
      <table class="pro_3">
         <tr class="tr_1">  
           <td style="width:120px;">会员ID</td>
           <td>商家</td>
           <td>订单总价</td>
           <td>产品总数</td>
           <td style="width:180px;">订单时间</td>
           <td style="width:120px;">操作</td>
         </tr>
        <tbody id="news_option">
        <volist name="order_list" id='list'>
        <tr data-id="{$list.id}" data-name="">
  		   <td>{$list.uid}</td>
  		   <td>{$list.shop_name}</td>
          <td>{$list.price}</td>
          <td>{$list.product_num}</td>
          <td>{$list.addtime|date='Y-m-d H:i:s',###}</td>
  		   <td><a href="javascript:;" onclick="win_open('{:U('show')}?oid={$list.id}',1055,700);">查看</a></td>
  	    </tr>
      </volist>
        </tbody>
      </table>
    </div>
    
</div>

<script>
var data = [],data_2=[];
data.push(
	{
		"label":"交易订单数",
		"data": [<?php echo trim($data1,','); ?>],
		points: { show: true },
		color: '#f3bd18'
	}
);

function tongji_view(){
    var options = {
        lines: { show: true },
        points: { show: true },
		grid: {backgroundColor: { colors: ['#fff', '#eee'] },hoverable: true},
		yaxis: {ticks: 3,min: 0},
        xaxis: { tickDecimals: 0, tickSize: 1}
    };
	
    $.plot($("#tongji"), data, options);
}
tongji_view();
$(window).on('resize',function(){
	tongji_view();
	request_data();
	});

var bool = true;

var previousPoint=null;
$('#tongji').on('plothover', function (event, pos, item) {
  
  if(!bool){return;}
  bool=false;
  setTimeout(function(){bool=true},1000);
  
  if (item) {
    if(previousPoint != item.datapoint){
      previousPoint = item.datapoint;
      $('#tooltip').remove();
	  item.datapoint[0]>=data[0].data.length-2 ? item.pageX-=80 : null;
      showTooltip(item.pageX, item.pageY ,'交易订单数: '+data[0].data[item.datapoint[0]][1]);
	}
  } else {
    $('#tooltip').remove();
    previousPoint = null;
  }
});

var inter = setInterval(function(){
  if(!$('.tickLabel').length>0){
	  return;
	  }
  clearInterval(inter);
  request_data();
	},50);

function request_data(){
  var $day_String=[<?php echo trim($day_String,','); ?>];
    $('.tickLabel').each(function(index, element) {
        $(this).html($day_String[index]);
    });
}

function showTooltip(x, y, contents) {
  if($('#tooltip').length>0){return;}
  $('<div id="tooltip">' + contents + '</div>').css( {
    position: 'absolute',
    display: 'none',
    top: y + 5,
    left: x + 5,
    border: '1px solid #fdd',
    padding: '2px',
    backgroundColor: '#fee',
    opacity: 0.80
  }).appendTo('body').fadeIn(200);
}

</script>
</body>
</html>